﻿<html>
<head>
    <title>TreeSelect - jQuery MiniUI 3.0 Documentation</title>    

    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <meta name="keywords" content="jquery,datagrid,grid,表格控件,ajax,web开发,java开发,.net开发,tree,table,treegrid" />
    <meta name="description" content="jQuery MiniUI - 专业WebUI控件库。jQuery MiniUI是使用Javascript实现的前端Ajax组件库，支持所有浏览器，可以跨平台开发，如Java、.Net、PHP等。" />

    <link href="css/common.css" rel="stylesheet" type="text/css" />
    <script src="core.js" type="text/javascript"></script>
    
        

    
</head>
<body>
    <h3>mini.TreeSelect</h3>
    
    <p>树形下拉选择框。</p>
    
    <h4>Extend</h4>
    <p> <a class="extendlink" href="popupedit.html">PopupEdit</a></p>    

    <h4>Usage</h4>
    <pre class="code"><span style="color:blue">&lt;</span><span style="color:maroon">input </span><span style="color:red">class</span><span style="color:blue">="mini-treeselect" </span><span style="color:red">url</span><span style="color:blue">="../data/tree.txt" </span><span style="color:red">valueField</span><span style="color:blue">="id" </span><span style="color:red">textField</span><span style="color:blue">="text"/&gt;
</span></pre>

    <h4>Screenshots</h4>
    <img src="images/treeselect.gif" />

    <h4>Examples</h4>
	<a class="demo" href="../../demo/treeselect/treeselect.html" target="_blank">TreeSelect</a>

    <h4>Properties</h4>
    <table>
        <tr><th>Name</th><th>Type</th><th>Description</th><th>Default</th><th><a href="setsupport.html" target="_blank" style="padding-left:5px;padding-right:5px;"> Set? </a></th><th><a href="getsupport.html" target="_blank" style="padding-left:5px;padding-right:5px;"> Get? </a></th><th><a href="tagsupport.html" target="_blank" style="padding-left:5px;padding-right:5px;"> Tag? </a></th></tr>
        
        <tr>
            <td>virtualScroll</td>
            <td>Boolean</td>
            <td>虚拟模式。适用于大数据显示场合。</td>
            <td>false</td>
            <td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td>
        </tr>   
        <tr>
            <td>data</td>
            <td>Array</td>
            <td>树形数据对象</td>
            <td></td>
            <td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td>
        </tr>   
        <tr>
            <td>url</td>
            <td>String</td>
            <td>数据加载地址</td>
            <td></td>
            <td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td>
        </tr> 
        <tr>
            <td>ajaxType</td>
            <td>String</td>
            <td>ajax类型：get/post。</td>
            <td></td>
            <td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td>
        </tr>
        <tr>
            <td>ajaxOptions</td>
            <td>Object</td>
            <td>ajax配置对象。如：ajaxOptions="{type:'post', async: true, data: {a:1, b: true}, dataType: 'text', contentType: 'application/x-www-form-urlencoded;charset=utf-8'}"。</td>
            <td></td>
            <td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td>
        </tr>
        <tr>
            <td>value</td>
            <td>String</td>
            <td>选中的节点值</td>
            <td></td>
            <td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td>
        </tr>
        <tr>
            <td>valueField</td>
            <td>String</td>
            <td>值字段。</td>
            <td>id</td>
            <td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td>
        </tr> 
        <tr>
            <td>parentField</td>
            <td>String</td>
            <td>父节点字段</td>
            <td>pid</td>
            <td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td>
        </tr>
        <tr>
            <td>resultAsTree</td>
            <td>Boolean</td>
            <td>url数据是否列表</td>
            <td>true</td>
            <td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td>
        </tr>
        <tr>
            <td>textField</td>
            <td>String</td>
            <td>节点文本字段</td>
            <td>text</td>
            <td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td>
        </tr> 
        <tr>
            <td>pinyinField</td>
            <td>String</td>
            <td>拼音字段</td>
            <td></td>
            <td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td>
        </tr>
        <tr>
            <td>multiSelect</td>
            <td>Boolean</td>
            <td>多选</td>
            <td>false</td>
            <td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td>
        </tr>        
        <tr>
            <td>checkRecursive</td>
            <td>Boolean</td>
            <td>是否联动选择</td>
            <td>false</td>
            <td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td>
        </tr>  
        <tr>
            <td>showTreeIcon</td>
            <td>Boolean</td>
            <td>显示节点图标</td>
            <td>true</td>
            <td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td>
        </tr> 
        <tr>
            <td>showTreeLines</td>
            <td>Boolean</td>
            <td>显示树形线条</td>
            <td>true</td>
            <td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td>
        </tr> 
        <tr>
            <td>showFolderCheckBox</td>
            <td>Boolean</td>
            <td>显示父节点checkbox</td>
            <td>false</td>
            <td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td>
        </tr> 
        
        <tr>
            <td>autoCheckParent</td>
            <td>Boolean</td>
            <td>是否自动选择父节点。比如选中子节点，将父节点也自动选中。</td>
            <td>false</td>
            <td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td>
        </tr>
        
        <tr>
            <td>expandOnLoad</td>
            <td>Boolean/Number</td>
            <td>加载后是否展开。比如：true展开所有节点；0展开第一级节点。以此类推。</td>
            <td>false</td>
            <td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td>
        </tr> 
        <tr>
            <td>valueFromSelect</td>
            <td>Boolean</td>
            <td>必须从选择项录入</td>
            <td>false</td>
            <td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td><td style="text-align:center;">&radic;</td>
        </tr>
    </table>

    <h4>Methods</h4>
    <table>
        <tr><th>Name</th><th>Parameter</th><th>Description</th><th>Return</th></tr>
        <tr>
            <td>setValue（value）</td>
            <td></td>
            <td>设置值</td>
            <td></td>
        </tr>
        <tr>
            <td>getValue（）</td>
            <td></td>
            <td>获取值</td>
            <td></td>
        </tr>
        <tr>
            <td>getFormValue（）</td>
            <td></td>
            <td>获取表单值</td>
            <td>String</td>
        </tr>
        <tr>
            <td>load（url）</td>
            <td></td>
            <td>加载数据</td>
            <td></td>
        </tr>
        <tr>
            <td>loadList ( Array, idField, parentField )</td>
            <td>
            </td>
            <td>加载列表数据。比如：tree.loadList(list, "id", "pid")<br />
            </td>
            <td></td>
        </tr>
        
        <tr>
            <td>getData ( )</td>
            <td></td>
            <td>获取树形数据</td>
            <td></td>
        </tr>
        <tr>
            <td>getList ( )</td>
            <td></td>
            <td>获取列表数据</td>
            <td></td>
        </tr>
        <tr>
            <td>getSelectedNode ( )</td>
            <td></td>
            <td>获取选中的节点</td>
            <td></td>
        </tr>
        <tr>
            <td>getCheckedNodes ( haveParent )</td>
            <td>haveParent: Boolean。是否包含父节点。</td>
            <td>获取Check选中的多个节点</td>
            <td></td>
        </tr>
    </table>

    <h4>Events</h4>
    <table>
        <tr><th>Name</th><th>EventObject</th><th>Description</th></tr>
        <tr>
            <td>valuechanged</td>
            <td></td>
            <td>值改变时发生</td>
        </tr>    
        <tr>
            <td>nodeclick</td>
            <td></td>
            <td>下拉项点击时发生</td>            
        </tr>  
        <tr>
            <td>beforenodecheck</td>
<td>
<pre>
{
  sender: Object,         //树对象
  node: Object,           //节点对象
  isLeaf: Boolean,
  checked: Boolean,       //Check状态
  cancel: false
}
</pre>
</td>
            <td>Check选择前发生</td>
        </tr>
        <tr>
            <td>beforenodeselect</td>
<td>
<pre>
{
  sender: Object,         //树对象
  node: Object,           //节点对象
  isLeaf: Boolean,
  cancel: false
}
</pre>
</td>
            <td>选择节点前发生</td>
        </tr>                   
    </table>


</body>
</html>